<template>
	<view class="main">
		<view>
			<view style="height: 20rpx;position: relative;z-index: 99;background: #F2F2F2;"></view>
			<view class="card">
				<view class="card-list flex flex-ai-c">
					<view class="card-title">提现金额</view>
					<view>（余额：<text style="color: #FCB527;font-weight: bold;">{{userinfo.money}}</text>）</view>
				</view>

				<view class="card-list card-list-price flex flex-ai-c" style="padding: 0 20rpx;height: 148rpx;">
					<view style="background: rgba(238,239,240,0.3);padding: 0 40rpx;border-radius: 6rpx"
						class="flex flex-ai-c flex-jc-sb f1">
						<view class="flex flex-ai-c">
							<text style="color: #FF3B30;margin-right: 20rpx;">¥</text>
							<view>
								<u-input v-model="withdrawalMoney" type="digit"
									:placeholder="text"></u-input>
							</view>
						</view>
						<view style="color: #FCB527;" @click="handleAll">全部</view>
					</view>
				</view>
			</view>
			<view class="card">
				<view class="card-title card-list flex flex-ai-c">
					提现须知
				</view>
				<view class="text">
					<rich-text user-select :selectable="true" :nodes="incomeRule"></rich-text>
				</view>
			</view>
		</view>
		<view style="padding: 100rpx;">
			<ButtonConfirm myTxt="提 交" @click="withdrawal"></ButtonConfirm>
		</view>
		<view v-if="show" style="background: rgba(0,0,0,0.5);width: 100%;height: 100%;
		position: absolute;top: 0;z-index: 1;" @click="show = false"></view>
	</view>
</template>

<script>
	import ButtonConfirm from '@/components/buttonConfirm.vue'
	import user from '@/api2/user.js';
	import common from '@/api2/common.js';
	export default {
		components: {
			ButtonConfirm
		},
		data() {
			return {
				text: '',
				show: false,
				withdrawalMoney: null,
				tempFilePaths: '',
				userinfo: {money: 0},
				dateList: [],
				select: {},
				domain_url: '',
				incomeRule: '',
				min_withdraw_amount: 1,
				max_withdraw_amount: 500
			}
		},
		onLoad() {
			this.getUserInfo()
			this.revenueRule()
		},
		methods: {
			async revenueRule() {
				const res = await common.revenueRule()
				this.incomeRule = res.data.rebate_withdrawal_notice
				this.min_withdraw_amount = res.data.min_withdraw_amount || 1
				this.max_withdraw_amount = res.data.max_withdraw_amount || 500
				this.text = `最低提现${this.min_withdraw_amount || 1}元`
			},
			async getUserInfo() {
				const res = await user.getUserInfo()
				this.userinfo = res.data
			},
			handleAll() {
				this.withdrawalMoney = this.userinfo.money
			},
			async withdrawal(){
				if((this.withdrawalMoney < this.min_withdraw_amount) || (this.withdrawalMoney > this.userinfo.money) || (this.withdrawalMoney > this.max_withdraw_amount)) return uni.showToast({
					title: `请输入正确的提现金额范围在（${this.min_withdraw_amount} - ${this.max_withdraw_amount}）`,
					icon: 'none'
				})
				const res = await user.withdrawal({
					money: this.withdrawalMoney,
					flag: 3,	//1个人2企业3用户
				})
				if(res.code == 200){
					uni.showToast({
						title: '提交成功',
						icon: 'none'
					})
					this.getUserInfo()
				}
			},
			chooseImg() {
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['compressed', 'original'], //可以指定是原图还是压缩图，默认二者都有'original', 
					sourceType: ['album', 'original'], //从相册选择
					success: (res) => {
						this.upload(res.tempFilePaths[0])
					}
				})
			},
			// 新增图片
			async upload(files) {
				let res = await common.upload(files)
				this.tempFilePaths = res.data.domain_url
				this.domain_url = res.data.url
			},
		}
	}
</script>
<style>
	page {
		background: #F2F2F2;
	}
</style>
<style lang="scss" scoped>
	/deep/.u-input{
		border: 0;
	}
	.main {
		
		.card {
			background: #fff;
			.text {
				padding: 30rpx 40rpx;
				font-size: 24rpx;
				font-weight: 400;
				color: #333333;
				line-height: 44rpx;
				user-select: text;
				-webkit-user-select: text
			}

			.card-list {
				padding: 0 40rpx;
				height: 108rpx;
				border-bottom: 1rpx solid #D8D8D8;
				background: #fff;

				.card-list-price {
					font-size: 32rpx;
				}
			}

			.card-title {
				font-size: 32rpx;
				font-weight: 400;
				color: #333333;
			}
		}
	}
</style>